<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition template="/plantillas/default.xhtml" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" xmlns:p="http://primefaces.org/ui" xmlns:f="http://java.sun.com/jsf/core">
    <ui:define name="titulo">
        <h:outputText value="Usuarios"/>
    </ui:define>
    <ui:define name="titulo_contenido">
        <f:attribute name="header" value="Usuarios"/>
    </ui:define>
    <ui:define name="acciones">
        <p:submenu label="Usuario">
            <p:menuitem value="Nuevo" icon="ui-icon-plusthick" oncomplete="crearUsuarioDialog.show();"/>
            <p:menuitem value="Editar" icon="ui-icon-pencil" action="#{usuarios.preEditarUsuario$action}" process="@this" update=":extForm:editarUsuarioPanelGrid"/>
            <p:menuitem value="Eliminar" icon="ui-icon-minusthick"/>
        </p:submenu>
        <p:submenu label="Navegaci&oacute;n">
            <p:menuitem value="Inicio" icon="ui-icon-home" action="inicio?faces-redirect=true"/>
        </p:submenu>
    </ui:define>
    <ui:define name="contenido">
        <p:dataTable id="usuariosTable" value="#{usuarios.listaUsuarios}" var="usuario" rowKey="#{usuario.hashCode()}" selection="#{usuarios.usuarioSeleccionado}" rows="10" paginator="true" paginatorAlwaysVisible="true">
            <p:ajax event="rowSelectRadio" update="@this"/>
            <p:column headerText="[Sel]" selectionMode="single" width="30"/>
            <p:column headerText="ID">
                <h:outputText value="#{usuario.id}"/>
            </p:column>
            <p:column headerText="Rol">
                <h:outputText value="#{usuario.idRol.id}"/>
            </p:column>
        </p:dataTable>
    </ui:define>
    <ui:define name="dialogos">
        <p:dialog id="crearUsuarioDialog" widgetVar="crearUsuarioDialog" header="Crear usuario" modal="true" width="500" resizable="false" closable="true" draggable="true">
            <h:panelGrid id="crearUsuarioPanelGrid" columns="2">
                <h:outputText value="ID"/>
                <p:inputText value="#{usuarios.crear$id}" size="50" required="true"/>
                <h:outputText value="Contrase&ntilde;a"/>
                <p:password value="#{usuarios.crear$passw}" size="50" required="true" feedback="true" promptLabel="Ingrese la contrase&ntilde;a" weakLabel="D&eacute;bil" goodLabel="Buena" strongLabel="Fuerte"/>
                <h:outputText value="Rol"/>
                <p:selectOneMenu style="width: 300px;" value="#{usuarios.crear$rol}" required="true">
                    <p:ajax event="valueChange"/>
                    <f:selectItem itemValue="#{null}" itemLabel="[Seleccione un rol]"/>
                    <f:selectItems value="#{usuarios.listaRoles}" var="rol" itemValue="#{rol}" itemLabel="#{rol.id}"/>
                </p:selectOneMenu>
                <f:facet name="footer">
                    <p:commandButton id="crear_guardar" value="Guardar" icon="ui-icon-disk" oncomplete="crearUsuarioDialog.hide();" action="#{usuarios.crearUsuario$action}" process="@this crearUsuarioPanelGrid" update="crearUsuarioPanelGrid :centerForm:usuariosTable"/>
                    <p:commandButton value="Cancelar" icon="ui-icon-close" immediate="true" oncomplete="crearUsuarioDialog.hide();"/>
                </f:facet>
            </h:panelGrid>
        </p:dialog>
        <!-- -->
        <p:dialog id="editarUsuarioDialog" widgetVar="editarUsuarioDialog" header="Editar usuario" modal="true" width="500" resizable="false" closable="true" draggable="true">
            <h:panelGrid id="editarUsuarioPanelGrid" columns="2">
                <h:outputText value="ID"/>
                <p:inputText value="#{usuarios.editar$id}" disabled="true" size="50" required="true"/>
                <h:outputText value="Contrase&ntilde;a"/>
                <p:password value="#{usuarios.editar$passw}" size="50" required="true" feedback="true" promptLabel="Ingrese la contrase&ntilde;a" weakLabel="D&eacute;bil" goodLabel="Buena" strongLabel="Fuerte"/>
                <h:outputText value="Rol"/>
                <p:selectOneMenu value="#{usuarios.editar$rol}" style="width: 300px;" required="true">
                    <p:ajax event="valueChange"/>
                    <f:selectItem itemValue="#{null}" itemLabel="[Seleccione un rol]"/>
                    <f:selectItems value="#{usuarios.listaRoles}" var="rol" itemValue="#{rol}" itemLabel="#{rol.id}"/>
                </p:selectOneMenu>
                <f:facet name="footer">
                    <p:commandButton id="editar_guardar" value="Guardar" icon="ui-icon-disk" action="#{usuarios.editarUsuario$action}" process="@this editarUsuarioPanelGrid" update="editarUsuarioPanelGrid :centerForm:usuariosTable"/>
                    <p:commandButton value="Cancelar" immediate="true" icon="ui-icon-close" oncomplete="editarUsuarioDialog.hide();"/>
                </f:facet>
            </h:panelGrid>
        </p:dialog>
    </ui:define>
</ui:composition>